import React from "react";
import { Tabs } from "antd";
import styles from "./index.less";
// eslint-disable-next-line import/no-named-as-default,import/no-named-as-default-member
import ProcessedTasks from "./components/ProcessedTasks";
// eslint-disable-next-line import/no-named-as-default,import/no-named-as-default-member
import MyApply from "./components/MyApply";

const { TabPane } = Tabs;

export default class TaskCenter extends React.Component {
  state = {
    key: "FlowHandle/getProProcessed",
  };

  componentDidMount() {
    const {
      location: {
        query: { key = "" },
      },
    } = this.props;

    if (key) {
      this.setState({ key });
    }
  }

  handleChange = (key) => {
    this.setState({ key });
  };

  render() {
    const { location } = this.props;

    const { key } = this.state;

    return (
      <div className={styles.root}>
        <Tabs
          defaultActiveKey="FlowHandle/getProProcessed"
          activeKey={key}
          onChange={this.handleChange}
        >
          <TabPane tab="经办任务" key="FlowHandle/getProProcessed">
            <ProcessedTasks />
          </TabPane>
          <TabPane tab="我的申请" key="FlowHandle/getProApply">
            <MyApply location={location} />
          </TabPane>
        </Tabs>
      </div>
    );
  }
}
